.dish-card {
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
    width: calc(33.333% - 10px);
    margin: 5px;
    float: left;
}
.dish-card img {
    width: 100%;
    height: auto;
}
.dish-info {
    padding: 10px;
    background-color: #FFEFD5; /* Papaya whip color */
}
.dish-info h3 {
    margin-bottom: 5px;
}
.dish-info p {
    margin-bottom: 10px;
}
.content-header {
    display: flex;
    justify-content: space-between; /* This will push the search box to the left and the button to the right */
    align-items: center; /* Align items vertically */
    margin-bottom: 20px;
}

.search-box {
    flex-grow: 1; /* Allows the search box to grow and fill the space */
    margin-right: 10px; /* Adds some space between the search box and the button */
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}


.button.add-new {
    padding: 10px 20px;
    background-color: #FFA07A; /* Salmon color */
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap; /* Prevents text from wrapping */
}

/* Add the rest of your CSS styles here... */
